<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<s:action name="header" executeResult="true">
	<s:param name="titles">Thêm sự kiện</s:param>
</s:action>
<script type="text/javascript" src="js/ckfinder/ckfinder.js"></script>

<script type="text/javascript">

function chooseFile()
{
    // You can use the "CKFinder" class to render CKFinder in a page:
    var finder = new CKFinder();
    finder.basePath = '/js/ckfinder/'; // The path for the installation of CKFinder (default = "/ckfinder/").
    finder.selectActionFunction = SetFileField;
    finder.popup();
} 
// This is a sample function which is called when a file is selected in CKFinder.
function SetFileField( fileUrl,data )
{
    document.getElementById( 'file_name' ).src = data['fileUrl'].substr(1);
    document.getElementById( 'file_url' ).value = data['fileUrl'].substr(1);
}
</script>
<s:action name="managesidebar" executeResult="true" />

<!-- Center -->
<div id="center_column_des" class="center_column">

<div class="breadcrumb">
	<a href="<s:url action="index"></s:url>">Trang chủ</a><span class="navigation-pipe">&gt;</span><span class="navigation_page">Thêm sự kiện</span>
</div>
<s:if test="%{slideshowEvent.size > 5}" >
	<div class="error" style="text-align:center;color: #CC0000;">Số lượng sự kiện của bạn đã hơn 6 sự kiện không thế thêm mới !</div>
<p class="cart_navigation">
	<a href="${link}" class="exclusive">« Trở lại trang trước</a>
</p>
</s:if>
<s:else>
<!-- /Breadcrumb -->
	<form action="<s:url action="addslideshow"></s:url>" method="post" class="std" enctype="multipart/form-data" name="addS" id="addS">
		<fieldset>
			<h3>Thêm sự kiện</h3>
			<table class="form">
				<tr>
					<td>Tiêu đề :</td>
					<td><input type="text" name="title" id="title" maxlength="50" value="" style="width:550px;"/></td>
				</tr>				
				<tr>
					<td style="vertical-align:middle;">Nội dung :</td>
					<td><textarea rows="5" cols="80" name="content" id="content" style="width:550px;"></textarea></td>
				</tr>
				<tr>
					<td style="vertical-align:middle;">Hình ảnh :</td>
					<td>
					<img title="Click để đổi hình" onclick="chooseFile()" id="file_name" style="cursor: pointer;" src="images/noslide.png" onerror="this.src='images/noslide.png'" width="550" />
					<input type="hidden" value="" name="fileUrl" id="file_url" />										
					</td>
				</tr>
			</table>
			<p class="submit" style="padding:10px 0 0 250px;">
				<input type="submit" name="submitSlideshow" id="submitSlideshow"
					value="Lưu" class="button_large">
			</p>
		</fieldset>
	</form>
	<!-- /MODULE contact -->
<script type="text/javascript">
$().ready(function() {
	$('#submitSlideshow').click(function() { 		 
        $(".error").remove();
        var hasError = false;

        var titleVal = $("#title").val();
        var messageVal = $("#content").val();
        var fileVal = $("#file_url").val();

        if($.trim(titleVal) == '') {
            $("#title").after('<span style="margin-left: 5px;margin-top: 5px;color: #CC0000;" class="error">Vui lòng nhập tiêu đề.</span>');
            hasError = true;
        }
        
        if($.trim(messageVal) == '') {
            $("#content").after('<span style="margin-left: 5px;margin-top: 5px;color: #CC0000;" class="error" >Vui lòng nhập nội dung.</span>');
            hasError = true;
        }        

        if($.trim(fileVal) == '') {
            $("#file_url").after('<span style="margin-left: 5px;margin-top: 5px;color: #CC0000;" class="error" >Vui lòng chọn hình đại diện.</span>');
            hasError = true;
        }        
        if(hasError == true) { return false; }

    }); 
});

</script>
</s:else>	
</div>

<s:action name="footer" executeResult="true" />